var mc; //多点触控对象
var id = getQueryString('id'); //当前id
var name, title, imgfile; //姓名，标题，图片
var userid, imgurl; //图片地址
var cw = document.documentElement.clientWidth;
var ch = document.documentElement.clientHeight;
var dispose = false; //处理图像开关
wx.ready(function() {
	// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
	share_weixin(id);
});
//图片预加载
var arrya = [
	"loading-text.png",
	"loading-circle2.png",
	"music.mp3",
	"load.gif",
	"bottom-text.png",
	"logo.png",
	"music-icon.png",
	"share.png",
	"text.png",
	"upload.png",
	"user-bg.png",
	"wx-share.jpg"
];
var baseUrl = 'images/',
	loader = new PxLoader();
var loaderFile = new PxLoader();
for(var i = 0; i < arrya.length; i++) {
	var imageUrl = baseUrl + arrya[i];
	pxImage = new PxLoaderImage(imageUrl);
	pxImage.imageNumber = i + 1;
	loaderFile.add(pxImage);
};
loaderFile.start();

loaderFile.addProgressListener(function(e) {
	//	console.log(e);
});

loaderFile.addCompletionListener(function(e) {
	$('body').css('display', 'block');
	document.getElementById('media').play();
	//微信必须加入Weixin JSAPI的WeixinJSBridgeReady才能生效 
	document.addEventListener("WeixinJSBridgeReady", function() {
		document.getElementById('media').play();
	}, false);
});
//禁止屏幕滚动
$("html,body").css({
	"width": cw,
	"height": ch
}).addClass('noscroll');
$("body").on("touchmove", function(event) {
	event.preventDefault();
});
//页面加载
$(function() {
	$(window).resize(function() {
		var thisHeight = $(this).height();
		if(ch - thisHeight > 50) { //呼出键盘
			$('.text').addClass('hide');
		} else { //收起键盘
			$('.text').removeClass('hide')
		}
	});
	WebFont.load({
		custom: {
			families: ['hyWbj'],
			urls: ['./css/poster.css?v=35'] //字体声明处，页面不需要引入该样式
		},
		loading: function() { //所有字体开始加载
			console.log('loading');
		},
		active: function() { //所有字体已渲染
			console.log('字体已渲染');
			getImgUrl(id);
		},
		inactive: function() { //字体预加载失败，无效字体或浏览器不支持加载
			console.log('字体预加载失败');
			getImgUrl(id);
		}
	});
});
//音乐控制
function musicControl() {
	var isRotate = $('#audio').hasClass('rotate');
	var audio = document.getElementById("media")
	if(isRotate) {
		$('#audio').removeClass('rotate');
		audio.pause();
	} else {
		$('#audio').addClass('rotate');
		audio.play();
	}
}
//根据id获取图片url
function getImgUrl(id) {
	if(id != null) {
		$.ajax({
			type: "post",
			// url: "http://emba2017ckgsb.moodnotes.cn?id=" + id,
			url: "http://127.0.0.1:8000/getimgurl?id=" + id,
			dataType: "json",
			async: true,
			success: function(res) {
				console.log(res);
				$('.result-page .result').attr('src', res.url);
				$('.result-page').removeClass('hide');
				//				share_weixin(id, res.name);
			}
		});
	} else {
		$('.result-page').removeClass('hide');
	}
}
//url查询
function getQueryString(name) {
	var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
	var r = window.location.search.substr(1).match(reg);
	if(r != null) {
		return unescape(r[2]);
	}
	return null;
}
//input获取焦点时隐藏
function focusHidden() {
	$('.edit-item').addClass('hide');
}
//input失去焦点时显示
function blurBlock() {
	$('.edit-item').removeClass('hide');
}

//wx分享设置
function share_weixin(id, title) {
	//分享朋友
	wx.onMenuShareAppMessage({
		title: '“凡是过往，皆为序章”开启长江新篇章！ ', // 分享标题
		desc: '欢迎长江商学院三十期学员', // 分享描述
		link: 'http://emba2017ckgsb.moodnotes.cn/poster.php?id=' + id, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
		imgUrl: 'http://emba2017ckgsb.moodnotes.cn/images/wx-share.jpg', // 分享图标
		type: 'link',
		trigger: function(res) {
			// alert('用户点击发送给朋友');
		},
		success: function(res) {
			// alert('已分享');
			$('.share-page').addClass('hide');
		},
		cancel: function(res) {
			// alert('已取消');
		},
		fail: function(res) {
			// alert(JSON.stringify(res));
		}
	});
	wx.onMenuShareTimeline({
		title: '“凡是过往，皆为序章”开启长江新篇章！ ', // 分享标题
		link: 'http://emba2017ckgsb.moodnotes.cn/poster.php?id=' + id, // 分享链接
		imgUrl: 'http://emba2017ckgsb.moodnotes.cn/images/wx-share.jpg', // 分享图标
		success: function() {
			// 用户确认分享后执行的回调函数、
			$('.share-page').addClass('hide');
		},
		cancel: function() {
			// 用户取消分享后执行的回调函数
		}
	});
	wx.onMenuShareQQ({
		title: '“凡是过往，皆为序章”开启长江新篇章！ ', // 分享标题
		desc: '欢迎长江商学院三十期学员', // 分享描述
		link: 'http://emba2017ckgsb.moodnotes.cn/poster.php?id=' + id, // 分享链接
		imgUrl: 'http://emba2017ckgsb.moodnotes.cn/images/wx-share.jpg', // 分享图标
		success: function() {
			// 用户确认分享后执行的回调函数
			$('.share-page').addClass('hide');
		},
		cancel: function() {
			// 用户取消分享后执行的回调函数
		}
	});
	wx.onMenuShareQZone({
		title: '“凡是过往，皆为序章”开启长江新篇章！ ', // 分享标题
		desc: '欢迎长江商学院三十期学员', // 分享描述
		link: 'http://emba2017ckgsb.moodnotes.cn/poster.php?id=' + id, // 分享链接
		imgUrl: 'http://emba2017ckgsb.moodnotes.cn/images/wx-share.jpg', // 分享图标
		success: function() {
			// 用户确认分享后执行的回调函数
			$('.share-page').addClass('hide');
		},
		cancel: function() {
			// 用户取消分享后执行的回调函数
		}
	});
}

//分享
function sharePage() {
	$('.share-page').removeClass('hide').on('click', function() {
		$('.share-page').addClass('hide');
	});
}
//开始编辑海报
function editPage() {
	$(".edit-page").on("touchmove", function(event) {
		event.preventDefault();
	});
	$('.result-page').addClass('hide');
	$('.edit-page').removeClass('hide');
}
//预览
function previewPage() {
	imgfile = $('#uploadfile').val();
	name = $('.user .name').val();
	title = $('.user .title').val();
	if(imgfile == '') {
		alert('请上传图片');
		return false;
	}
	if(name == '') {
		alert('请填写姓名');
		return false;
	}
	if(title == '') {
		alert('请填写title');
		return false;
	}
	if(title.length >= 15) {
		alert('最多输入15个中文字符');
		return false;
	}
	$('.edit-in').addClass('hide');
	$('.preview-in').removeClass('hide');
	$('.user p.name').html(name);
	$('.user p.title').html(title);
	$('.pre-loading').removeClass('hide');
	mc.destroy();
	if(!dispose) {
		setTimeout(function() {
			takeScreenshot();
		}, 1000)
	} else {
		takeScreenshot();
	}
}

//屏幕截图
function takeScreenshot() {
	var dpr = $('html').attr('data-dpr');
	var imgsrc = $(".edit-img img").attr("src");
	var dealsrc = $(".edit-img img").attr("dealsrc");
	$(".edit-img img").attr("src", dealsrc);
	var w = $("#view").width();
	var h = $("#view").height();
	var canvas = document.createElement("canvas");
	var ratio = 4 / dpr;
	//要将 canvas 的宽高设置成容器宽高的 ratio 倍
	canvas.width = w * ratio;
	canvas.height = h * ratio;
	canvas.style.width = w + "px";
	canvas.style.height = h + "px";
	var context = canvas.getContext("2d");
	//然后将画布缩放，将图像放大两倍画到画布上
	context.scale(ratio, ratio);
	html2canvas($('#view'), {
		canvas: canvas,
		onrendered: function(canvas) {
			var imageInfo = canvas.toDataURL("image/jpeg");
			var req = {
				'name': name,
				'title': title,
				'img_info': imageInfo,
				'dpr': dpr
			}
			if(userid != undefined) {
				req.id = userid;
			}
			$.ajax({
				type: "post",
				// url: "http://emba2017ckgsb.moodnotes.cn/poster",
				url: "http://127.0.0.1:8000/upload",
				async: true,
				dataType: "json",
				data: req,
				success: function(res) {
					console.log(res);
					$(".edit-img img").attr("src", imgsrc);
					imgurl = res.url;
					userid = res.id;
					share_weixin(res.id, res.title);
					$('.pre-loading').addClass('hide');
				},
				error: function(res) {
					console.log(res);
					if(res.statusText == 'Request Entity Too Large') {
						alert('您上传的图片大小已超上限，请压缩至5M以内使用!');
						$('.pre-loading').addClass('hide');
						editAgainPage();
					}
				}
			});
		}
	});
}
//重新编辑
function editAgainPage() {
	$('.preview-in').addClass('hide');
	$('.edit-in').removeClass('hide');
}
//保存图片
function saveImagePage() {
	var showPicture = imgurl;
	wx.previewImage({
		current: showPicture, // 当前显示图片的http链接
		urls: [showPicture] // 需要预览的图片http链接列表
	});
}
//前端显示图像
function showBGURL() {
	dispose = false;
	var resultFile = document.getElementById("uploadfile").files[0];
	var lrzRes = null;
	if(resultFile) {
		if(resultFile.size > 5347738) {
			alert('您上传的图片大小已超上限，请压缩至5M以内使用!');
			 $('#uploadfile').val('');
		} else {
			$('.upload-file img').addClass('hide');
			var reader = new FileReader();
			reader.readAsDataURL(resultFile);
			reader.onload = function(e) {
				var urlData = this.result;
				$(".edit-img").removeClass('hide');
				att = 1;
				c1 = 0;
				c2 = 0;
				$("#hdScale").val(att);
				$("#hdX").val(c1);
				$("#hdY").val(c2);
				$(".edit-img img").css('-webkit-transform', 'scale(' + att + ') translate(' + c1 + 'px,' + c2 + 'px)');
				$(".edit-img img").attr("src", urlData);
				lrz(resultFile, {}, function(results) {
					lrzRes = results.base64;
					$(".edit-img img").attr("dealsrc", lrzRes);
					dispose = true;
				});
				initHammer(document.querySelector(".edit-page"));
			};
		}
	}
}
//多点触控初始化
function initHammer(el) {
	mc = new Hammer(el, {
		multiUser: true
	});
	mc.get('pan').set({
		direction: Hammer.DIRECTION_ALL
	});
	mc.get('swipe').set({
		direction: Hammer.DIRECTION_ALL
	});
	mc.get('pinch').set({
		enable: true
	});
	mc.get('rotate').set({
		enable: true
	});
	mc.on("pinchstart", function(ev) {
		s1 = ev.scale;
	});
	mc.on("pinchmove", function(ev) {
		s2 = ev.scale;
		if(/Android (\d+\.\d+)/.test(navigator.userAgent)) {
			att = att + s2 - s1;
		} else {
			if(s2 > s1) att = att + 0.01;
			if(s1 > s2) att = att - 0.01;
		}
		$("#hdScale").val(att);
		$("#hdX").val(c1);
		$("#hdY").val(c2);
		$(".edit-img img").css('-webkit-transform', 'scale(' + att + ') translate(' + c1 + 'px,' + c2 + 'px)');
		s1 = s2;
	});
	//mc.on("pinchend", function (ev) {at=10;});
	mc.on("panstart", function(e) {
		a1 = e.deltaX;
		b1 = e.deltaY;
	});
	mc.on("panmove", function(e) {
		a2 = e.deltaX;
		b2 = e.deltaY;
		a3 = a2 - a1;
		b3 = b2 - b1;
		e = 20;
		d1 = Number(c1) + Number(a3);
		d2 = Number(c2) + Number(b3);
		c1 = d1;
		c2 = d2;
		$(".edit-img img").css('-webkit-transform', 'scale(' + att + ') translate(' + c1 + 'px,' + c2 + 'px)');
		a1 = a2;
		b1 = b2;
		$("#hdScale").val(att);
		$("#hdX").val(c1);
		$("#hdY").val(c2);
	});

}